.clearfix:before,
.clearfix:after {
    display: table;
    content: '';
}
.clearfix:after {
    clear: both;
}
// flex对齐
.flex-center {
    align-items: center;
    vertical-align: middle;
}
.default-main-row {
    height: 100%;
    margin: 0;
    .left-side {
        background-color: #1d2733;
    }
    .el-col {
        height: 100%;
        .default-aside {
            // height: 100%;
            .el-menu {
                height: 100%;
            }
        }
    }
}
// 用户主要操作面板
.gztx-main-panel {
    // 卡片容器

}
.gztx-box-card {
    margin: 10px;
    @include base-box-shadow;
    // 卡片头部
    .header-title {
        font-size: 18px;
        border-left: 4px solid #2988cc;
        float: left;
        margin: {
            left: 10px;
            // top: 10px;
        }
        padding: {
            left: 10px;
        }
    }
    // 头部按钮
    .header-button {
        float: left;
    }
    // 卡片主体
    .gztx-box-card-body {
        // 操作控件部分
        .gztx-form-header {
            // display: flex;
            .gztx-form-item {
                display: flex;
                @extend .flex-center;
                .gztx-form-label {
                    font-size: 14px;
                    width: 90px;
                    flex-grow: 1;
                    text-align: right;
                    flex-shrink: 0;
                }
                .gztx-form-control {
                    flex-grow: 1;
                    flex-shrink: 1;
                    width: 300px;
                }
            }
        }
    }

    .el-row {
        flex-grow: 1;
        // width: 1600px;
        // width: 100%;
        .el-table {
            height: 80%;
        }
    }
}
// .gztx-card {
//     ::-webkit-scrollbar {
//         width: 4px;
//         // height: 20px;
//     } /* 这是针对缺省样式 (必须的) */

//     ::-webkit-scrollbar-track {
//         background-color: #8a8a8a;
//         // border-radius: 4px;
//         // height: 60%;
//     } /* 滚动条的滑轨背景颜色 */

//     ::-webkit-scrollbar-thumb {
//         // background-color: rgba(77, 77, 77, 0.2);
//         // -webkit-border-radius: 4px;
//         //   border-radius: 4px;
//         background-color: rgb(192, 192, 192);
//     } /* 滑块颜色 */

//     ::-webkit-scrollbar-button {
//         background-color: #7c2929;
//         display: none;
//     } /* 滑轨两头的监听按钮颜色 */

//     ::-webkit-scrollbar-corner {
//         background-color: rgb(105, 105, 105);
//     } /* 横向滚动条和纵向滚动条相交处尖角的颜色 */
// }
/*  note: 使用滚动条的时候切记 display: block; overflow: auto;
*/

@mixin gztx-scroll(){
    $size:mini,small,medium,normal;
    $barWidth:4px,6px,8px,10px;
    .gztx-scroll-size-#{$size}{
    position: relative;
    ::-webkit-scrollbar {
        position: absolute;
        right: 10px;
        width: 8px;
        height: 8px;
        // height: 20px;
        // border-radius: 4px;
    } /* 这是针对缺省样式 (必须的) */

    ::-webkit-scrollbar-track {
        background-color: #8a8a8a;
        border-radius: 4px;
        // height: 60%;
    } /* 滚动条的滑轨背景颜色 */

    ::-webkit-scrollbar-thumb {
        // background-color: rgba(77, 77, 77, 0.2);
        // -webkit-border-radius: 4px;
        border-radius: 4px;
        background-color: rgb(192, 192, 192);
        &:active {
            background-color: #d1d1d1;
        }
    } /* 滑块颜色 */

    ::-webkit-scrollbar-button {
        background-color: #7c2929;
        display: none;
    } /* 滑轨两头的监听按钮颜色 */

    ::-webkit-scrollbar-corner {
        background-color: rgb(105, 105, 105);
    } /* 横向滚动条和纵向滚动条相交处尖角的颜色 */
    }
}

.gztx-scroll-size-medium {
    position: relative;
    ::-webkit-scrollbar {
        position: absolute;
        right: 10px;
        width: 8px;
        height: 8px;
        // height: 20px;
        // border-radius: 4px;
    } /* 这是针对缺省样式 (必须的) */

    ::-webkit-scrollbar-track {
        background-color: #8a8a8a;
        border-radius: 4px;
        // height: 60%;
    } /* 滚动条的滑轨背景颜色 */

    ::-webkit-scrollbar-thumb {
        // background-color: rgba(77, 77, 77, 0.2);
        // -webkit-border-radius: 4px;
        border-radius: 4px;
        background-color: rgb(192, 192, 192);
        &:active {
            background-color: #d1d1d1;
        }
    } /* 滑块颜色 */

    ::-webkit-scrollbar-button {
        background-color: #7c2929;
        display: none;
    } /* 滑轨两头的监听按钮颜色 */

    ::-webkit-scrollbar-corner {
        background-color: rgb(105, 105, 105);
    } /* 横向滚动条和纵向滚动条相交处尖角的颜色 */
}

.gztx-scroll-size-small {
    ::-webkit-scrollbar {
        width: 4px;
        // height: 20px;
        // border-radius: 4px;
    } /* 这是针对缺省样式 (必须的) */

    ::-webkit-scrollbar-track {
        background-color: #8a8a8a;
        border-radius: 4px;
        // height: 60%;
    } /* 滚动条的滑轨背景颜色 */

    ::-webkit-scrollbar-thumb {
        // background-color: rgba(77, 77, 77, 0.2);
        // -webkit-border-radius: 4px;
        border-radius: 4px;
        background-color: rgb(192, 192, 192);
        &:active {
            background-color: #d1d1d1;
        }
    } /* 滑块颜色 */

    ::-webkit-scrollbar-button {
        background-color: #7c2929;
        display: none;
    } /* 滑轨两头的监听按钮颜色 */

    ::-webkit-scrollbar-corner {
        background-color: rgb(105, 105, 105);
    } /* 横向滚动条和纵向滚动条相交处尖角的颜色 */
}
.pagination-container{
    width: 100%;
    text-align: center;
}
.index-flex{
    .user-info {
        position: absolute;
        height: 40px;
        width: 166px;
        right: 0px;
        top: 40px;

        .avatar {
            float: left;
            background-color: $color-purple;
            display: inline-block;
            width: 40px;
            height: 40px;
            //border:0px solid transparent;
            border: {

                radius: 50%;
            };
        }

        .name {
            margin-left: 10px;
            display: inline-block;
            float: left;
            width: 66px;
            height: 100%;
            font-size: 16px;
            font-family: Microsoft YaHei;
            font-weight: 400;
            line-height: 40px;
            color: #FFFFFF;
            opacity: 1;

        }
    }

}

